
<template>
	<el-dialog title="评价信息"  visible :show-close="false" :modal-append-to-body="false" class="wrap" size="tiny">
		<i class="el-icon-close close" @click="cancel" style="color: white;z-index:10"></i>
		<div class="bt">查看评价</div>
		<el-form label-width="100px" class="form">
			<div class="grid-content bg-purple">
						<div style="float: left;">上课情况：</div>
						<el-rate v-model="skxs"></el-rate>
					</div>
					<el-checkbox-group v-model="skcheckList" class="check1">
					 <el-checkbox class="check" label='表现优异'>表现优异</el-checkbox>
					 <el-checkbox class="check"  label='上课专心'>上课专心</el-checkbox>
					 <el-checkbox class="check" label='乐于参与'>乐于参与</el-checkbox>
					 <el-checkbox class="check" label='守秩序'>守秩序</el-checkbox>
					 <el-checkbox class="check" label='有进步'>有进步</el-checkbox>
				 </el-checkbox-group>
				 
				 <div class="grid-content bg-purple">
						<div style="float: left;">作业情况：</div>
						<el-rate v-model="zyxs"></el-rate>
					</div>
					<el-checkbox-group v-model="zycheckList" class="check1">
					 <el-checkbox class="check" label='认真完成'>认真完成</el-checkbox>
					 <el-checkbox class="check"  label='积极上交'>积极上交</el-checkbox>
					 <el-checkbox class="check" label='书写工作'>书写工作</el-checkbox>
					 <el-checkbox class="check" label='订正及时'>订正及时</el-checkbox>
					 <el-checkbox class="check" label='有进步'>有进步</el-checkbox>
				 </el-checkbox-group>
				 
				 <div class="grid-content bg-purple">
						<div style="float: left;">背书情况：</div>
						<el-rate v-model="bsxs"></el-rate>
					</div>
					<el-checkbox-group v-model="bscheckList" class="check1">
					 <el-checkbox class="check" label='积极主动'>积极主动</el-checkbox>
					 <el-checkbox class="check"  label='复习效果佳'>复习效果佳</el-checkbox>
					 <el-checkbox class="check" label='背诵流畅'>背诵流畅</el-checkbox>	
				 </el-checkbox-group>

					 <div class="grid-content bg-purple" >需要加强</div>
				 <el-checkbox-group v-model="checkList2" class="check1" >
	 				 <el-checkbox class="check2" label='专注度'>专注度</el-checkbox>
	 				 <el-checkbox class="check2" label='写'>写</el-checkbox>
	 				 <el-checkbox class="check2" label='拼字'>拼字</el-checkbox>
	 				 <el-checkbox class="check2" label='句型'>句型</el-checkbox>
	 				 <el-checkbox class="check2" label='读'>读</el-checkbox>
	 				 <el-checkbox class="check2" label='字母拼写'>字母拼写</el-checkbox>
	 				 <el-checkbox class="check2" label='听说'>听说</el-checkbox>
	 			 </el-checkbox-group>
	 			 
	 			  <div class="grid-content bg-purple">
						<div style="float: left;">留言：</div>
				  </div>
			    <div class="ly" style="width: 90%;padding-left: 20px;margin-top: 8px;">
				<el-input v-model="jqnote" type="textarea" :rows="2" :readonly="true"  icon="info" class="select-block1"></el-input>
				</div>
		</el-form>

		<el-button type="danger" class="submit" @click="submit">退出</el-button>
	</el-dialog>
</template>

<script type="text/javascript">
	import qs from 'qs'
	export default {
		props: ['params'],
		data() {
			return {
				skxs:0,
				zyxs:0,
				bsxs:0,
				jqnote:'',
				skcheckList	:[],
				zycheckList	:[],
				bscheckList	:[],
				checkList2	:[],
			}
		},
		created() {
           this.form=this.params.row;
					 this.getpjinfo()
		},
		methods: {
			submit(){
					this.$emit('close', { type: 'pjinfo', cancel: false });
			},
			getpjinfo() {
				//检测
				this.$store.state.loading = true;
				//装载数据
				var logininfo = JSON.parse(localStorage.logininfo);
				var params2 = qs.stringify({
					kqid:this.form.kqid
				})
				//执行
				this.axios.post(this.$store.state.api + 'kqjl/getpjinfo', params2)
					.then(res => {
						console.log(res,'1111111111111111111')
						this.jqnote = res.data.data.list[0].jqnotes
						this.skxs =  parseInt(res.data.data.list[0].skxs)
						this.zyxs =  parseInt(res.data.data.list[0].zyxs)
						this.bsxs =  parseInt(res.data.data.list[0].bsxs)
						
						this.checkList2 = res.data.data.list[0].jqms
						this.skcheckList = res.data.data.list[0].skstr
						this.zycheckList = res.data.data.list[0].zystr
						this.bscheckList = res.data.data.list[0].bsstr
						
						
						this.checkList2 = res.data.data.list[0].jqms.split(' ')
						this.skcheckList = res.data.data.list[0].skstr.split(' ')
						this.zycheckList = res.data.data.list[0].zystr.split(' ')
						this.bscheckList = res.data.data.list[0].bsstr.split(' ')
					}).catch(res => {
						this.$message.warning("服务器异常");
						this.$store.state.loading = false;
					})
			},
			cancel() {
				this.$emit('close', { type: 'pjinfo', cancel: false })
			}
		}
	}
</script>

<style lang="less" scoped>
.wrap {
	text-align: center;
}
.bt{
		position: absolute;
		top:0;
		left: 0;
		width: 100%;
		height: 50px;
		margin: 0 auto;
		background: #50BFFF;
		color:white;
		text-align:left;
		line-height: 50px;
		font-size: 17px;
		padding-left: 15px;
	}
.check{
	width: 40%;
	height: 30px;
	// line-height: 30px;
	text-align: left;
	margin-left: 10px;
}
.check1{
	text-align: left;
	margin-top: 15px;
}
.check2{
	width: 40%;
	height: 30px;
	// line-height: 30px;
	text-align: left;
	margin-left: 10px;
	.inp{
		width: 70%;
	}
}
.form {
	text-align: left;
}
 .input {
					width: 300px;
					display: inline-block;
			}

.select-block {
	display: block;
}

.submit {
	width: 120px;
	margin-top: 20px;
}
.el-row {
	margin-bottom: 20px;
	&:last-child {
		margin-bottom: 0;
	}
}
.el-col {
	border-radius: 4px;
	// margin-top: 20px;
	height: 15px;
}
.bg-purple-dark {
	background: #99a9bf;
}
.bg-purple {
	margin-left: 2.5%;
	width: 90%;
	padding-left: 10px;
	background: #d3dce6;
}
.bg-purple-light {
	background: #e5e9f2;
}
.grid-content {
	border-radius: 4px;
	min-height: 25px;
	line-height: 25px;
}
.row-bg {
	padding: 10px 0;
	background-color: #f9fafc;
}
</style>
